<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <%@ include file="/common/dxp/include/common-base.jsp" %>
    <title>存证数据查询</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
</head>

<!-- Part 一、 以下是body主体内容的模块区域 -->
<body class="hold-transition ${sysColor} sidebar-mini">
<div class="wrapper">

    <!-- top start -->
    <%@include file="/common/dxp/top.jsp" %>
    <!-- top end -->
    <!-- left start -->
    <%@include file="/common/dxp/left.jsp" %>
    <!-- left end-->

    <div class="content-wrapper">
        <!-- Main start -->
        <section class="content">
            <div id="div_hidden_content" class="hidden" style="display:none;">
                <input name="templateType" type="hidden" value="all"/>
                <div id="hidden_common_final">
                    <!-- temp="hidden_common_final" start -->
                    <!-- temp="hidden_common_final" end -->
                </div>
                <!-- temp="delForm_hidden" start -->
                <div id="delForm_hidden">
                </div>
                <!-- temp="delForm_hidden" end -->
                <select
                        data-live-search='true'
                        id="initForm1_dxGwRuleSite_interfaceCode"
                        class="form-control  clean"
                        data-temp-obj="dxGwRuleSite.interfaceCode"
                        data-dict-code="dymicSql" data-dict-cate=""
                        data-colmun="{value:'interfaceCode',text:'interfaceName'}"
                        data-obj-name="dxInterfaceReg"
                        data-page-name="dx-interface-reg"
                        data-form-name="searchForm" data-condition=""
                        data-type-tag="select" >
                    <option value="">--请选择--</option>
                </select>
            </div>
            <div class="row">
                <div class="col-xs-12">

                    <!------搜索  start ------->
                    <div class="box box-info">
                        <!--搜索title  start -->
                        <div class="box-header with-border">
                            <h3 class="box-title"><i class="fa fa-search"></i> 存证数据查询搜索</h3>
                            <div class="box-tools pull-right">
                                <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                        class="fa fa-minus"></i></button>
                            </div>
                        </div>
                        <!--搜索title  end -->
                        <div class="box-body">
                            <form id="searchForm" action="javascript:void(0);">
                                <!-- temp="searchForm_hidden" start -->
                                <div id="searchForm_hidden">
                                    <input  type="hidden" name="indexName" value="depositcertificate">
                                    <input  type="hidden" name="indexType" value="doc">
                                    <input  type="hidden" name="orderCloumn" value="createdTime">
                                    <input  type="hidden" name="orderSort" value="desc">
                                    <input  type="hidden" name="fileList" class="clean">
                                </div>
                                <!-- temp="searchForm_hidden" end -->

                                <!-- temp="searchForm_content" start -->
                                <div id="searchForm_content" class="form-group" data-temp-code="true"
                                     data-temp-type="searchForm" data-temp-form-id="searchForm">
                                    <table class="table table-bordered bordercolor">
                                        <tbody>
                                        <tr>
                                            <td class="active" align="right"><label
                                                    class="form-control-static">服务/接口编号：</label></td>
                                            <td>
                                                <div class="form-group">
                                                    <input id="searchForm_input_interfaceCode" name="interfaceCode" class="form-control clean" maxlength="30">
                                                </div>
                                            </td>
                                            <td class="active" align="right"><label
                                                    class="form-control-static">存储时间：</label></td>
                                            <td>
                                                <div class="form-group">
                                                    <div class="input-group ">
                                                        <input id="searchForm_input_startDate"  name="input_startDate" maxlength="30" class="form-control clean form_datetime" readonly="readonly" type="text">
                                                        <span class="input-group-addon"> <i class="fa fa-calendar"></i></span>
                                                        <span class="input-group-addon"> 至 </span>
                                                        <input id="searchForm_input_endDate"  name="input_endDate" maxlength="30" class="form-control clean form_datetime" readonly="readonly" type="text">
                                                        <span class="input-group-addon"> <i class="fa fa-calendar"></i></span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <!-- temp="searchForm_content" end -->
                            </form>
                            <div class="box-footer text-center">
                                <button type="button" class="btn btn-success" onclick="getTableData();"
                                        data-temp-event="searchForm_hidden"><i class="fa fa-search"></i> 查询
                                </button>
                                 
                                <button type="button" class="btn btn-warning"
                                        onclick="mytools.cleanData('#searchForm');">重置
                                </button>
                            </div>
                        </div>
                    </div>
                    <!------- 搜索 end -------->

                    <!------- 列表 start -------->
                    <div class="box box-success">
                        <!--列表title  start -->
                        <div class="box-header with-border">
                            <h3 class="box-title"><i class="fa fa-table"></i> 查询结果 [共计<span id="dataListTotalCount">0</span>条数据]
                            </h3>
                            <div class="box-tools pull-right">
                                <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                        class="fa fa-minus"></i></button>
                            </div>
                        </div>
                        <div class="box-body">
                            <table id="dataList" class="table table-bordered table-hover">
                                <thead>
                                <tr id="dataList_thead_content" data-temp-code="true" data-temp-type="table"
                                    data-temp-show="dataList_template_content">
                                    <th>序号</th>
                                    <!-- temp="dataList_thead_content" start -->
                                    <th>请求唯一ID</th>
                                    <th>服务/接口编号及名称</th>
                                    <th>接口(服务)地址</th>
                                    <th>存储时间</th>
                                    <th>操作</th>
                                    <!-- temp="dataList_thead_content" end -->
                                </tr>
                                </thead>
                                <tbody id="dataList-body">

                                </tbody>
                            </table>
                        </div>

                        <div class="box-footer text-center">
                            <ul id="dataList-page" class="pagination">
                            </ul>
                        </div>
                    </div>
                    <!------- 列表 end -------->
                </div>
            </div>

            <div win-title="查看窗口" class="modal fade" id="my_modal_view" tabindex="-2" role="dialog"
                 aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog" style="width:80%;">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                ×
                            </button>
                            <h4 class="modal-title">
                                <font color="red">存证数据</font> 
                            </h4>
                            <form id="viewForm" action="javascript:void(0)">
                                <!-- temp="viewForm_hidden" start -->
                                <div id="viewForm_hidden" style="display:none;"></div>
                                <!-- temp="viewForm_hidden" end -->
                            </form>
                        </div>
                        <div class="modal-body viewForm">

                            <div class="nav-tabs-custom">
                                <ul class="nav nav-tabs" id="myTab-view">
                                </ul>

                                <!-- tab content start -->
                                <div class="tab-content">

                                    <div class="tab-pane active" id="tabView_1">
                                        <form class="form-horizontal" role="form" id="viewForm1"
                                              action="javascript:void(0)">

                                            <!-- temp="viewForm1_content" start -->
                                            <div id="viewForm1_content">
                                                <table class="table table-bordered bordercolor">
                                                    <tbody>
                                                    <tr>
                                                        <td>
<%--                                                            <label class="form-control-static">存证数据：</label>--%>
                                                            <div class="form-control-static">
                                                                <pre style="height: 460px; overflow-y: scroll;"><code id="viewForm1_certificate_data"></code></pre>
                                                            </div>
                                                        </td>
                                                    </tr>

                                                    </tbody>
                                                </table>
                                            </div>
                                            <!-- temp="viewForm1_content" end -->

                                        </form>
                                    </div>


                                </div>
                                <!-- tab content e -->
                            </div>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
            </div>

            <!-- Part 二、以下是template模板定义的模块区域 -->
            <script type="text/template" id="dataList-template">
                <? for ( var i = 0; i < rows.length; i++) {?>
                <tr>
                    <td><?=(pageObj.currentPage-1)*10+(i+1)?></td>
                    <!-- temp="dataList_template_content" start -->
                    <td style='display:none;'>
                        <input type="hidden" name="infoId" primary="infoId"  value="<?=strUtil.doNull(rows[i].infoId,'')?>"/>
                    </td>
                    <td title="<?=rows[i].traceId?>"><?=strUtil.subStr(rows[i].traceId,10)?></td>
                    <td><?=strUtil.doNull(rows[i].interfaceCode,'')?></br><?=dictListMap['dx-interface-reg-searchForm'][strUtil.doNull(rows[i].interfaceCode,'')]?></td>
                    <td>/data/<?=strUtil.doNull(rows[i].sourceCode,'')?></td>
                    <td><?=getFormatDateByLong(rows[i].createdTime,"yyyy-MM-dd hh:mm:ss")?></td>
                    <!-- temp="dataList_template_content" end -->
                    <td>
                        <button type="button" class="btn btn-success btn-xs" onclick="toLoad('<?=rows[i].rowkey?>','<?=rows[i].tableName?>')"><i
                                class="fa fa-search-plus"></i> 查看
                        </button>
<%--                        <button type="button" class="btn btn-primary btn-xs" onclick="toDataAnalysis('<?=rows[i].rowkey?>','depositcertificate')"><i--%>
<%--                                class="fa fa-exchange"></i> 数据解析--%>
<%--                        </button>--%>
                    </td>
                </tr>
                <?}?>
            </script>

            <!-- Part 三、 以下是js模块区域 -->
            <script>
                var clickMenu = "certificate-data-list";
                var myPage, dataListId, searchFormId;
                myPage = 10;//定义列表数据
                dataListId = "dataList";//显示列表数据div的id
                searchFormId = "searchForm";//搜索表单Id
                /**
                 * 初始化数据字典，id传入#id 返回值Map用法：dictListMap["userType"][rows[i].userType]
                 */
                var dictListMap = DictUtil.initDictAndDymic();
                var timeStamp,tableListMap={};
                $(function () {

                    //初始化当天零时时间
                    timeStamp = new Date(new Date().setHours(0, 0, 0, 0));
                    $("#searchForm_input_startDate").val(timeStamp.format("yyyy-MM-dd hh:mm:ss"));
                    //1、加载分页列表数据
                    getTableData();
                    //2、控制是否启用token
                    //setToken();

                });

                $(function () {
                    //设置数据行选中效果
                    $('#' + dataListId + ' tbody').on('click', 'tr', function (e) {
                        if ($(this).hasClass('selected')) {
                        } else {
                            $('tr.selected').removeClass('selected');
                            $(this).addClass('selected');
                        }
                        //var id = $('tr.selected th').eq(0).html();
                    });
                });
                //注入日历框样式
                /*var dateObject = $('.datepicker').datepicker({
                    language: 'zh-CN',
                    inline: true,
                    todayBtn: "linked",
                    format: "yyyy-mm-dd",
                    minuteStep:5,
                    autoclose: true
                }).on('hide', function (e) {
                    //bootstrap datepicker与bootstrapValidator同时使用时选择日期后无法正常触发校验的解决方法
                    //当日期选择框关闭时，执行刷新校验。
                    var fieldName = $(this).attr("name");//获取当前元素name
                    var formId = $(this).parents("form").eq(0).attr("id");//获取当前元素所在父层级中的就近的formId
                    // $("#" + formId).data('bootstrapValidator').updateStatus(fieldName, 'NOT_VALIDATED', null).validateField(fieldName);
                });*/
                $('.form_datetime').datetimepicker({
                    // container: ".modal-content",
                    format: 'yyyy-mm-dd hh:ii:ss',
                    /* minView: "month",  *///选择日期后，不会再跳转去选择时分秒
                    language: 'zh-CN',
                    dateFormat: 'yyyy-mm-dd',//日期显示格式
                    timeFormat: 'HH:mm:ss',//时间显示格式
                    todayBtn: 1,
                    autoclose: 1,
                    minView: 0,  //0表示可以选择小时、分钟   1只可以选择小时
                    minuteStep: 5,//分钟间隔1分钟
                    endDate: new Date()
                });


                //给模态窗口内form表单内的所有支持必填项的元素注入校验
                $(".modal").on('shown.bs.modal', function () {
                    $(this).find("form").each(function () {
                        var formId = $(this).attr("id");
                        if (!strUtil.isNull(formId)) {
                            formId = "#" + formId;
                            setValidate(formId);//定义add表单验证属性
                            mytools.cleanValidate(formId);//清空上次校验规则提示
                        }
                    });
                });


                //数据toLoad读取（查看、编辑）数据
                function toLoad(rowKey,tableName) {
                    $("#viewForm1_certificate_data").text("");
                    $("#my_modal_view").modal("show");
                    if('1'==common_sys_version_mode){
                        //简版不走hbase
                        var data = tableListMap[rowKey].message;
                        // console.log(data,"data--fpc");
                        //反显加载数据
                        if (data) {
                            mytools.showJsonViewer(data,"viewForm1_certificate_data");
                            // $("#viewForm1_certificate_data").text();
                        }else {
                            $("#viewForm1_certificate_data").text("暂未查到数据");
                        }
                    }else{
                        $.get(ctx+"/api/esSearchHbaseByRowKey", {"rowKey":rowKey,"tableType":"certificate","tableName":tableName}, function (myData) {
                            console.log(myData);
                            //反显加载数据
                           /* if ("T"==myData.flag) {
                                $("#viewForm1_certificate_data").text(JSON.stringify(myData.data));
                            }*/
                            if ("T"==myData.flag&&myData.data) {
                                console.log(myData.data,"myData.data");
                                mytools.showJsonViewer(myData.data,"viewForm1_certificate_data");
                                // $("#viewForm1_analytical_data").text(JSON.stringify(myData.data));
                            }else{
                                $("#viewForm1_certificate_data").text("暂未查到数据");
                            }
                        }, "json");
                    }
                }


                //加载列表数据
                function getTableData() {
                    var flag=false;

                    var file={};
                    var fileList =[];
                    //小于等于
                    var lte = $("#searchForm_input_endDate").val();
                    //大于等于
                    var gte=$("#searchForm_input_startDate").val();
                    if(strUtil.isNull(gte) && strUtil.isNull(lte)){
                        $("#searchForm_input_startDate").val(timeStamp.format("yyyy-MM-dd hh:mm:ss"));
                        gte=$("#searchForm_input_startDate").val();
                    }
                    if(lte||gte){
                        file["fileName"]="createdTime";
                        if(lte){
                            var lteLong = new Date((lte).replace(new RegExp("-","gm"),"/")).getTime();
                            file["lte"]=lteLong;
                        }
                        if(gte){
                            var gteLong = new Date((gte).replace(new RegExp("-","gm"),"/")).getTime();
                            file["gte"]=gteLong;
                        }
                        flag=true;
                        fileList.push(file);
                    }
                    var interfaceCode =$("#searchForm_input_interfaceCode").val();
                    if(interfaceCode){
                        file={};
                        file["fileName"]="interfaceCode";
                        file["fileValue"]="*"+interfaceCode+"*";
                        file["searchType"]="wildcard";
                        flag=true;
                        fileList.push(file);
                    }
                    if(flag){
                        // fileList.push(file);
                        $("#" + searchFormId).find("input[name='fileList']").val(JSON.stringify(fileList))
                    }else {
                        layer.alert("请输入查询条件");
                        return;
                    }
                    var index_load = layer.load(1, {shade: false});
                    $.ajax({
                        type: 'get',
                        url: ctx+"/api/esSearchPageList",
                        data: $("#" + searchFormId).serialize() + getCurrentPage(ctx+"/api/esSearchPageList?" + $("#" + searchFormId).serialize(), myPage),
                        // contentType:'application/json',
                        dataType: 'json',
                        success: function (myData) {
                            console.log(myData);
                            $("#dataListTotalCount").text(myData.total);
                            if ("T" == myData.flag) {
                                var data = baidu.template(dataListId + "-template", eval(myData));
                                $("#" + dataListId + "-body").html(data);
                                var option = {
                                    ele: $("#" + dataListId + "-page")[0],
                                    total: myData.total,
                                    fn: getTableData,
                                    url: ctx+"/api/esSearchPageList?" + $("#" + searchFormId).serialize()
                                }
                                generatePages(option);
                                if(myData.total>0){
                                    saveTableListMapData(myData.rows);
                                }
                            }

                        }
                    });
                    layer.close(index_load);
                }
                function saveTableListMapData(data){
                    // console.log(data,"fpc001");
                    for (var i=0;i<data.length;i++){
                        var key = data[i].es_metadata_id;
                        // console.log(key,"key");
                        tableListMap[key]=data[i];
                    }
                }
                function toDataAnalysis(rowkey,indexName) {
                    var index_load = layer.load(1, {shade: false});
                    $.ajax({
                        type: 'get',
                        url: ctx+"/api/dataAnalysisByRowKey",
                        data: {"rowKey":rowkey,"indexName":indexName},
                        // contentType:'application/json',
                        dataType: 'json',
                        success: function (myData) {
                            console.log(myData);
                            layer.alert(myData.msg);
                            layer.close(index_load);

                        }
                    });
                }



                //刷新
                function refresh() {
                    getTableData();
                }

                //设置token
                function setToken() {
                    $.ajax({
                        type: 'get',
                        url: '${ctx}/sendPage/token?token=true',
                        dataType: 'text',
                        success: function (myData) {
                            console.log(myData);
                            $('.formToken').val(myData);
                        }
                    });
                }


                /**** Part 四、以下是自定义新增方法  ****/
//1.定义校验规则-定义
                function setValidate(id) {
                    $(id).each(function () {
                        $(this).bootstrapValidator({
                            feedbackIcons: {
                                valid: 'glyphicon glyphicon-ok',
                                invalid: 'glyphicon glyphicon-remove',
                                validating: 'glyphicon glyphicon-refresh'
                            }, /** 以下需要结合实际业务清空补充个表单元素的验证规则 **/
                            fields: {
                                /** 可自定义新增验证规则
                                 "uctUser.userEname":{
		    		 validators: {
		    			 regexp: {
		    				 regexp: /^[0-9]+$/,
		                      message: '只能是数字'
		                  }
		              }
		    	}
                                 **/
                            }
                        });
                    });
                }


            </script>
        </section>
        <!-- Main end -->
    </div>
    <!-- foot start -->
    <%@include file="/common/dxp/foot.jsp" %>
    <!-- foot start -->
</div>
<!-- /.content-wrapper -->
</body>
</html>

